<script>
import { defineComponent, getCurrentInstance } from "vue";

export default defineComponent({
  props: {
    that: Object,
  },
  setup(props) {
    return { that: props.that };
  },
  render() {
    let that = this.that;
    return (
      <div class="styleValue">
        <span>
          页面位置:
          <span
            style={{
              color: "#0084ff",
              fontSize: "18px",
              marginLeft: "10px",
            }}
          >
            {this.$store.state.aimAttrs.sort}
          </span>
        </span>
        <a-button-group>
          <a-button
            disabled={this.$store.state.aimAttrs.sort == 0}
            onClick={() => {
              this.$store.commit("aimAttrsChange", {
                newValue: {
                  value: this.$store.state.aimAttrs.sort,
                  type: "up",
                },
                attrsName: "sort",
                that,
              });
            }}
          >
            <ArrowUpOutlined style={{ color: "#08c" }} />
            上移
          </a-button>
          <a-button
            disabled={
              this.$store.state.aimAttrs.sort ==
              this.$store.state.page.tree[that.pageName].length - 1
            }
            onClick={() => {
              this.$store.commit("this.$store.state.aimAttrsChange", {
                newValue: {
                  value: this.$store.state.aimAttrs.sort,
                  type: "down",
                },
                attrsName: "sort",
                that,
              });
            }}
          >
            下移
            <ArrowDownOutlined style={{ color: "#52c41a" }} />
          </a-button>
        </a-button-group>
      </div>
    );
  },
});
</script>
